<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>任务管理</title>
	<meta name="renderer" content="webkit|ie-comp|ie-stand">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<script src="/style/public/publicStyle.js"></script>
</head>

<body >
<div class="weadmin-nav">
			<span class="layui-breadcrumb" style="visibility: visible;">
			<a href="">任务管理</a><span lay-separator="">/</span>
			<a>
				<cite>指标SQL配置</cite></a>
			</span>
	<a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
		<i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>


<div class="layui-row">
	<div class="layui-col-md2">
		<table class="layui-hide" id="tableDataList" lay-filter="mainTableFilter"></table>
	</div>
	<div class="layui-col-md10">
		<form class="layui-form" action="">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">事实表选择</label>
					<div class="layui-input-inline">
						<select name="modules" lay-filter="mainSelectId" lay-verify="required" lay-search="" style="width: 300px" id="mainSelectId">
							<option value="">直接选择或搜索选择</option>
						</select>
					</div>
				</div>
			</div>
		</form>

		<!--表格-->
		<div class="weadmin-body">
			<div class="layui-row">
				<div class="layui-bg-gray" style="padding: 30px;" id="dwTbtables">
				</div>
			</div>
			<fieldset class="layui-elem-field">
				<legend>依赖维度</legend>
				<div class="layui-field-box">

					<table class="layui-table" id="dimTb">
						<thead>
						<tr>
							<th>事实表</th>
							<th>事实维度</th>
							<th>维度描述</th>
							<th>维度表</th>
							<th>操作</th>
						</tr>
						</thead>
						<tbody>
						</tbody>
					</table>
				</div>
			</fieldset>
			<div class="layui-row">
				<form class="layui-form layui-from-pane" id="formId" style="margin-top:20px" lay-filter="tableForm">
					<input type="hidden" name="idBase"/>
					<div class="layui-form-item">
						<div class="layui-row">
							<div class="layui-col-md5">
								<label class="layui-form-label">时间字段</label>
								<div class="layui-input-block">
									<input type="text" name="tbTar"  required  lay-verify="required" autocomplete="off" placeholder="请输入目标表" class="layui-input">
								</div>
							</div>
							<div class="layui-col-md5">
								<label class="layui-form-label">value值</label>
								<div class="layui-input-block">
									<input type="text" name="tbTar"  required  lay-verify="required" autocomplete="off" placeholder="请输入目标表" class="layui-input">
								</div>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-row">
							<div class="layui-col-md5">
								<label class="layui-form-label">JOIN条件</label>
								<div class="layui-input-block">
									<textarea name="qsql" placeholder="多个条件;分割" required rows="10" class="layui-textarea"></textarea>
								</div>
							</div>
							<div class="layui-col-md5">
								<label class="layui-form-label">过滤条件</label>
								<div class="layui-input-block">
									<textarea name="qsql" placeholder="机构、时间区间排除" required rows="10" class="layui-textarea"></textarea>
								</div>
							</div>
						</div>
					</div>

					<div class="layui-form-item" style="margin-top:40px">
						<div class="layui-input-block">
							<button class="layui-btn  layui-btn-submit " lay-submit="" lay-filter="demo11">提交</button>
							<button type="reset" class="layui-btn layui-btn-primary">重置</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>

</body>
<script>
    tbCheckBoxClick = function(elem) {
        var tds = $(elem).parent().siblings("td");
        var dimFld = tds[0].innerText;
        var dimFldNa = tds[1].innerText;
		var tbNa = tds[2].innerText;
		debugger;
		if(elem.checked) {
		    if($("#"+dimFld).length>0) {
                layer.alert("该维度已从其他事实表添加");
		        return;
			}
            $.ajax({
                url: '/hoze/baseDimtb/getById',
                type:'get',
                data:{"pk":dimFld},
                success: function(data1) {
                    var data =data1.data; //提出返回数据中的data
                    if(data!=null) {
                        var tr = "<tr id='"+dimFld+"'><td>"+tbNa+"</td><td>"+dimFld+"</td><td>"+dimFldNa+"</td><td>"+data.naDimtb+"</td>"+
                            "<td><button type=\"button\" class=\"layui-btn layui-btn-xs\">字段</button><button type=\"button\" class=\"layui-btn layui-btn-xs\">值</button></td></tr>";
                        $("#dimTb tbody:last").append(tr);
                    } else {
                        $(elem).attr("checked", false);
                    }
                }
            });
		} else {
		    $("#"+dimFld).remove();
		}
    };
    deleteDwTb = function (elem) {
        debugger;
        var del = true;
        $(elem).parent().find("input:checkbox").each(function (index,data) {
			if(this.checked) {
			    debugger;
                layer.alert("请先取消已勾选的维度");
                del = false;
                return;
			}
        });
        if(del) {
            $(elem).parent().remove();
		}
    };
	layui.use(['util','laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element'], function(){
		var util = layui.util;
		var laydate = layui.laydate //日期
				,laypage = layui.laypage //分页
				,layer = layui.layer //弹层
				,table = layui.table //表格
				,carousel = layui.carousel //轮播
				,upload = layui.upload //上传
				,element = layui.element //元素操作
				,form = layui.form;
        table.render({
            elem: '#tableDataList'
            ,even: false //开启隔行背景
            ,cellMinWidth: 80
            ,toolbar: '#toolbarDemo'
            ,defaultToolbar:[]
            ,url:'/hoze/baseIndex/findByPage'
            ,cols: [[
                ,{field:'pk', title: 'ID', hide:true}
                ,{field:'cd', title: '编码'}
                ,{field:'na', title: '名称'}
            ]]
            ,page: true
        });
        $.ajax({
            url: '/etl/mdMedTb/find',
            type:'post',
            dataType:'json',
            contentType:'application/json;charset=UTF-8',
            data:JSON.stringify({"sdTbca":"DW"}),
            success: function(data1) {
                var data =data1.data; //提出返回数据中的data
                if (data!== null) {
                    $.each(data, function(index, item) { //循环加入 data的元素
                        $("#mainSelectId").append('<option value="'+item.idMedTb+'">'+item.na+'('+item.idMedTb+')</option>');
                    });
                    form.render('select');
                };
            }
        });

        var createDimTable = function (element,selectValue,selectHtml) {
            var row = $(element);
            $.ajax({
                url: '/etl/mdMedTbFd/findTbDimField',
                type:'get',
                data:{"idMedTb":selectValue},
                success: function(data1) {
                    var data =data1.data; //提出返回数据中的data
                    if (data!== null) {
                        var tbTop = '<div class="layui-col-md3" style="overflow:auto;zoom:1;" id="'+selectValue+'">'+
                            '<span style="float: right;font-size:24px;cursor:pointer;z-index: 11;position: relative;" onclick="deleteDwTb(this)">×</span>'+
                            '<div class="layui-card">'+
                            '<div class="layui-card-header">'+selectHtml+'</div>'+
                            '<div class="layui-card-body">'+
                            '<table class="layui-table">'+
                            '<colgroup><col width="50"><col><col></colgroup>'+
                            '<thead><tr><th></th><th>表名</th><th>描述</th></tr></thead>'+
                            '<tbody>';
                        var tbTail = '</tbody>'+
                            '</table>'+
                            '</div>'+
                            '</div>'+
                            '</div>';
                        var tbMiddle = '';
                        $.each(data, function(index, item) { //循环加入 data的元素
							tbMiddle += ('<tr>'+
										'<th><input type="checkbox" onclick="tbCheckBoxClick(this)"></th>'+
										'<td>'+item.pkPubfd+'</td>'+
										'<td>'+item.na+'</td>'+
							            '<td style="display: none">'+selectValue+'</td>'+
										'</tr>');
                        });
                        row.html(row.html()+tbTop+tbMiddle+tbTail);
                        row.attr("size",row.attr("size")+1);
                    };
                }
            });
        };
        var createOneRow = function() {
            var html = '<div class="layui-row layui-col-space15" size="0"></div>';
            $("#dwTbtables").append(html);
		};
        form.on('select(mainSelectId)', function(data){
            if($("#"+data.value).length>0) {
				return;
			}
            var row = $("#dwTbtables").find(".layui-col-space15").last();
            if(row.length==0) {
                createOneRow();
			} else {
                if(row.attr("size")==4) {
                    createOneRow();
				}
			}
            row = $("#dwTbtables").find(".layui-col-space15").last();
            createDimTable(row[0],data.value,this.innerHTML);

        });

	});
</script>

</html>